<!DOCTYPE html>
<html lang="en">
​
<head>
    <meta charset="UTF-8">
    <title>没有防抖</title>
    <style type="text/css"></style>
    <script type="text/javascript">
      window.onload = function () {
          //模拟ajax请求
          function ajax(content) {
              console.log('ajax request ' + content)
          }

          let inputNormal = document.getElementById('normal')

          function debounce(fn, delay) {
            return function(args) {
              let that = this
              let _args = args
              clearTimeout(fn.id)
              fn.id = setTimeout(() => {
                fn.call(that, _args)
              }, delay);
            }
          }

          let debounceAjax = debounce(ajax, 500)

          inputNormal.addEventListener('keyup', function (e) {
            debounceAjax(e.target.value)
          })
      }
    </script>
</head>
​
<body>
    <div>
        1.没有防抖的输入：
        <input type="text" name="normal" id="normal">
    </div>
</body>
​
</html>